import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:series_play/comm/base/base_state.dart';
import 'package:series_play/comm/ext/context_ext.dart';
import 'package:series_play/generated/assets.dart';
import 'package:series_play/pages/account/controller/quick_login_controller.dart';
import 'package:series_play/utils/comm_style.dart';
import 'package:series_play/utils/jump_helper.dart';
import 'package:series_play/widget/app_color.dart';
import 'package:series_play/widget/app_image.dart';

import '../../widget/app_text.dart';

class QuickLoginPage extends StatefulWidget {
  const QuickLoginPage({super.key});

  @override
  State<QuickLoginPage> createState() => _QuickLoginPageState();
}

class _QuickLoginPageState
    extends BaseControllerState<QuickLoginPage, QuickLoginController> {
  @override
  Widget buildPage(BuildContext context) {
    return Stack(
      children: [
        Positioned(
          top: 0.2.sh,
          left: 0,
          right: 0,
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              Container(
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(20).r,
                  gradient: const LinearGradient(
                    begin: Alignment.topCenter,
                    end: Alignment.bottomCenter,
                    colors: [Color(0xffd90f52), Color(0xfff99917)],
                  ),
                ),
                width: 72.w,
                height: 72.w,
                child: Center(),
              ),
              16.verticalSpace,
              CommStyle.shaderMaskView(
                AppText(context.tr.quickLoginIconName, fontSize: 14),
              ),
              46.verticalSpace,
              loginWayItem(
                Assets.imagesIcLoginFacebook,
                context.tr.facebookLogin,
                () {},
                isLight: true,
              ),
              18.verticalSpace,
              loginWayItem(
                Assets.imagesIcLoginGoogle,
                context.tr.googleLogin,
                () {},
              ),
              18.verticalSpace,
              loginWayItem(
                Assets.imagesIcLoginApple,
                context.tr.appleLogin,
                () {},
              ),
              24.verticalSpace,
              GestureDetector(
                onTap: () {
                  JumpHelper.accountLogin();
                },
                child: Text(
                  context.tr.accountLogin,
                  style: TextStyle(
                    color: AppColor.white_60,
                    fontSize: 14.sp,
                    decoration: TextDecoration.underline,
                    decorationColor: AppColor.white_60,
                  ),
                ),
              ),
            ],
          ),
        ),

        Positioned(
          left: 32.w,
          right: 32.w,
          bottom: context.mediaQueryPadding.bottom + 24.w,
          child: Text.rich(
            TextSpan(
              style: TextStyle(fontSize: 12.sp, color: AppColor.white_40),
              children: [
                TextSpan(text: context.tr.loginAgreementPrefix),
                TextSpan(text: '《${context.tr.userAgreement}》'),
                TextSpan(text: context.tr.loginAgreementAnd),
                TextSpan(text: '《${context.tr.privacyAgreement}》'),
              ],
            ),
          ),
        ),
      ],
    );
  }

  @override
  createController() {
    return QuickLoginController();
  }

  Widget loginWayItem(
    String icon,
    String name,
    VoidCallback onTap, {
    bool isLight = false,
  }) {
    return GestureDetector(
      onTap: onTap,
      child: Container(
        margin: const EdgeInsets.symmetric(horizontal: 32).w,
        height: 44.w,
        decoration: BoxDecoration(
          color: isLight ? const Color(0xFF2A74D7) : const Color(0xFF393D45),
          borderRadius: BorderRadius.circular(6).r,
        ),
        child: Stack(
          children: [
            Positioned(
              left: 24.w,
              top: 0,
              bottom: 0,
              child: AppImage(icon, size: 18),
            ),
            Align(child: AppText(name, color: Colors.white)),
          ],
        ),
      ),
    );
  }
}
